<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> 
<script src="${pageContext.request.contextPath}/dwz/js/jquery-form.js" type="text/javascript"></script>
<style>

.form-div{
	background-color:rgba(255,255,255,0.27); 
	border-radius:10px; 
	border:1px solid #aaa; 
	width:250px; 
	margin:10px;
	padding:20px 0 20px 0px; 
	font-size:12px;
	box-shadow:inset 0px 0px 10px rgba(255,255,255,0.5),0px 0px 15px rgba(75,75,75,0.3); 
	text-align:left;
}

.form-div-title{
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	color: blue;
}

.form-div-file{
	margin:3px 0 0 10px;
}

.form-div table{margin:0 auto; text-align:right; color:rgba(64,64,64,1.00);border-collapse:separate; border-spacing:15px;}
.form-div table img{vertical-align:middle; margin:0 0 5px 0;}
.alipay{width:70px;height:28px;border:1px solid #ffb660;background:#fe9e19;color:#ffffff;cursor:pointer;}
</style>

<script type="text/javascript">
function coscu_pay(){
	var url = "alipay_payDialog.action";
	var dlgId = "apipay_payDialog";
	var title = "支付提醒";
	var options = {
			width:300,
			height:130,
			max:false,
			mask:true,
			maxable:false,
			minable:false,
			resizable:false,
			drawable:false,
			fresh:"true"
	};
	$.pdialog.open(url, dlgId, title, options);
	$("#coscu_payForm").submit();
}


function wait_order_detail_export(){
	$("#wait_order_detail_form", navTab.getCurrentPanel()).attr("action","orderDetail_exportOrderDetail.action");
	$("#wait_order_detail_form", navTab.getCurrentPanel()).attr("onsubmit","");
	$("#order_detail_export_btn", navTab.getCurrentPanel()).click();
	//$.post("orderDetail_delDir.action");
	
} 

</script>

<div class="pageContent">
	<div class="panelBar">
	<ul class="toolBar">
	<li><a class="icon" href="javascript:wait_order_detail_export();"><span>导出Excel</span></a></li>
	</ul>
	</div>
		<div style="width:75%;float:left; border-right:1px dotted ;">
		<form id="wait_order_detail_form" name="wait_order_detail_form"  enctype="multipart/form-data">
		<input name="orderDetailId" type="hidden" value="${rcoId }"  > 
		<input name="orderDetailNo" type="hidden" value="${rcoNo }"  > 
		<c:set var="payStuCount" value="0"></c:set>
			<table class="table" width="100%" layoutH="60">
				<thead>
					<tr>
						<th>序号</th>
						<th>姓名</th>
						<th>年级</th>
						<th>班级</th>
						<th>补卡类型</th>
						<th>费用单价</th>
					</tr>
				</thead>
				<tbody id="listBody">
					<c:forEach items="${rcodDetail}" var="rcodetail" varStatus="status">
					<c:choose>
						<c:when test="${rcodetail.rcodType==1 }">
						   <tr style='background:#CAFF70;'></c:when>
						<c:when test="${rcodetail.rcodType==2 }">
						   <tr style='background:#CAE1FF;'></c:when>
						<c:when test="${rcodetail.rcodType==3 }">
						<c:set var="payStuCount" value="${payStuCount+1 }"></c:set>
						   <tr></c:when>
					</c:choose>
						<%-- <input type="hidden" name="stu_ids" value="${rcodetail.stuId }"/> --%>
							<td>${status.index+1 }</td>
							<td>${rcodetail.stuName}</td>
							<td>${rcodetail.graName }</td>
							<td>${rcodetail.clsName }</td>
							<td>
							<c:choose>
							<c:when test="${rcodetail.rcodType==1 }">印刷错误</c:when>
							<c:when test="${rcodetail.rcodType==2 }">卡片损坏</c:when>
							<c:when test="${rcodetail.rcodType==3 }">卡片丢失</c:when>
							</c:choose>
							</td>
							<td>${rcodetail.rcodPrice}</td>
						</tr>
					</c:forEach>
					
				</tbody>
			</table>
					<button id="order_detail_export_btn" type="submit" style="display:none;">导出</button>
			</form>
		</div>
		<div style="width:24%;float:left;" layoutH="30"  >
			<div class="form-div">
				<div class="form-div-title">补卡单据信息</div>
				<table>
					<tr>
						<td>订单编号：</td>
						<td align="left">${rcoNo }</td>
					</tr>
					<c:choose>
						<c:when test="${rcoAmount>0}">
							<tr>
								<td>单据类型：</td>
								<td align="left">
								<c:choose>
								<c:when test="${payStatus==0 }">
								<span style="color:green;">免费</span>
								</c:when>
								<c:otherwise>
								<span style="color: red;">收费</span>
								</c:otherwise>
								</c:choose>
								</td>
							</tr>
							<tr>
								<td>补卡人数：</td>
								<td align="left">
									${fn:length(rcodDetail)}人&nbsp;&nbsp;(付费<c:out value="${payStuCount}"/>人)
								</td>
							</tr>
							<tr>
								<td>
									支付金额：
								</td>
								<td align="left">
									￥${rcoAmount } 
								</td>
							</tr>
						</c:when>
						<c:otherwise>
							<tr>
								<td>单据类型：</td>
								<td align="left">
									<span style="color: green;">免费</span>
								</td>
							</tr>
							<tr>
								<td>补卡人数：</td>
								<td align="left">
									${fn:length(rcodDetail)}人
								</td>
							</tr>
						</c:otherwise>
					</c:choose>
						<tr>
							<td>收货地址：</td>
							<td align="left" >
								<div style="width:140px;">
								<span style="line-height: 20px;">${consigName}&nbsp;${consigPhone }</span><br>
								<span>${consigAddress}</span></div>
							</td>
						</tr>
				</table>
				
			</div>
			<c:if test="${!empty rcodPhoto }">
	             <div class="form-div">
				<div class="form-div-title">卡片更换证明</div>
				<table width="100%" >
				<c:forEach items="${rcodPhoto}" var="rcodphoto" varStatus="status">
				<tr>
				  <td width="100%"  title="${rcodphoto.rcoPhotoPath }">
				   <a href='http://static.pajx.com.cn/RpCard/${rcodphoto.rcoPhotoPath}' style="float:left;">附件${status.index+1 } 点击下载</a>
				   </td>
				</tr>
				</c:forEach>
				</table>
				</div>
			</c:if>
				<c:if test="${!empty rcodRelation and progStatus!=1 }">
	             <div class="form-div">
				<div class="form-div-title">补卡进度追踪</div>
				<c:forEach items="${rcodRelation}" var="rcodRelation" varStatus="status">
				<c:choose>
				   <c:when test="${status.index==0 }">
				      <c:choose>
				          <c:when test="${progStatus==0 }">
				              <div class="follow_status2">
				          </c:when>
				          <c:otherwise>
				              <div class="follow_status1">
				      	  </c:otherwise>
				      </c:choose>
				   </c:when>
				   <c:otherwise>
				      <div class="follow_status">
				   </c:otherwise>
				   </c:choose>
				<ul>
				<li>
				<fmt:parseDate value="${rcodRelation.dealTime }" var="date" pattern="yyyyMMddHHmmss" /> 
				<fmt:formatDate value="${date}"	pattern="yyyy-MM-dd HH:mm:ss" />
				</li>
				<li>${rcodRelation.remark }--${rcodRelation.dealOperName }</li>
				</ul>
				
				</div>
				</c:forEach>
				
				
				</div>
			</c:if>
				</div>
				
		<div>
</div>
<style>
div.follow_status ul li{
margin:5px;
color:rgb(162, 162, 162);
}
div.follow_status1 ul li{
margin:5px;
color:green;
}
div.follow_status2 ul li{
margin:5px;
color:#ff0000;/**红色*/
}
div.follow_status{
margin:10px 0px 0px 20px;
border-left:solid 1px rgb(162, 162, 162);
}
div.follow_status1{
margin:10px 0px 0px 20px;
border-left:solid 1px rgb(162, 162, 162);
}
div.follow_status2{
margin:10px 0px 0px 20px;
border-left:solid 1px rgb(162, 162, 162);
}					
</style>